<template>
  <div>
    <Container padding="0px 3.125vw">
      <navPanel
        :activeId="navActiveIndex"
        :data="navPanelData"
        @item-click="navPanelItemClick"
      />
    </Container>
    <Container class="support-container" padding-top="0">
      <TableTags :data="tagsData[navActiveIndex - 1]" />
      <TableService />
    </Container>

    <DialogService
      ref="dialogServiceRef"
      :supportData="dialogData"
    ></DialogService>
    <DialogMobileService
      ref="dialogMobileServiceRef"
      :supportData="dialogData"
    ></DialogMobileService>
  </div>
</template>

<script setup lang="ts">
import data from "./data.ts";
import { useCacheStore, useMemberStore } from "../../../store";
import { message } from "ant-design-vue";
import { getCurrentInstance, onMounted } from "vue";

const $t = getCurrentInstance()?.appContext.config.globalProperties.$t;

const cacheStore = useCacheStore();
const memberStore = useMemberStore();
const dialogData = ref();
const dialogServiceRef = ref();
const dialogMobileServiceRef = ref();
const consultService = (data) => {
  if (!memberStore.profile) {
    message.warning($t("message.wait_login"));
    return;
  }
  dialogData.value = data;
  nextTick(() => {
    if (isMobile()) {
      dialogMobileServiceRef.value.show();
    } else {
      dialogServiceRef.value.show();
    }
  });
};

// 导航数据
const navActiveId = ref(1);
const navActiveIndex = ref(1);
const navPanelData = ref([
  {
    value: 1,
    label: "",
  },
  {
    value: 2,
    label: "",
  },
  {
    value: 3,
    label: "",
  },
  {
    value: 4,
    label: "",
  },
]);
const setNavPanelData = (num: number) => {
  let title = "";
  if (num == 0) {
    title = $t("content.support.base_maintain.title");
  }
  if (num == 1) {
    title = $t("content.support.airline_service.title");
  }
  if (num == 2) {
    title = $t("content.support.assembly_unit_maintain.title");
  }
  if (num == 3) {
    title = $t("content.support.borehole_inspection_service.title");
  }
  return title;
};
const navPanelItemClick = (item) => {
  navActiveIndex.value = item.value;
};

// 设置表格数据
const tableData = ref();
const setTableData = () => {};
// 设置表格标签数据
const tagsData = ref([]);
const setPageData = () => {
  for (let i = 0; i < 4; i++) {
    tagsData.value[i] = getTagsData(i);
    navPanelData.value[i].label = setNavPanelData(i);
  }
};
// 设置 标签 数据
const getTagsData = (num: number) => {
  let arr: string[] = [];
  if (num == 0) {
    arr[0] = $t("content.support.base_maintain.tags.label_1");
    arr[1] = $t("content.support.base_maintain.tags.label_2");
    arr[2] = $t("content.support.base_maintain.tags.label_3");
    arr[3] = $t("content.support.base_maintain.tags.label_4");
    arr[4] = $t("content.support.base_maintain.tags.label_5");
  }
  if (num == 1) {
    arr[0] = $t("content.support.airline_service.tags.label_1");
    arr[1] = $t("content.support.airline_service.tags.label_2");
    arr[2] = $t("content.support.airline_service.tags.label_3");
    arr[3] = $t("content.support.airline_service.tags.label_4");
    arr[4] = $t("content.support.airline_service.tags.label_5");
    arr[5] = $t("content.support.airline_service.tags.label_6");
  }
  if (num == 2) {
    arr[0] = $t("content.support.assembly_unit_maintain.tags.label_1");
    arr[1] = $t("content.support.assembly_unit_maintain.tags.label_2");
    arr[2] = $t("content.support.assembly_unit_maintain.tags.label_3");
    arr[3] = $t("content.support.assembly_unit_maintain.tags.label_4");
    arr[4] = $t("content.support.assembly_unit_maintain.tags.label_5");
  }
  if (num == 3) {
    arr[0] = $t("content.support.borehole_inspection_service.tags.label_1");
    arr[1] = $t("content.support.borehole_inspection_service.tags.label_2");
    arr[2] = $t("content.support.borehole_inspection_service.tags.label_3");
    arr[3] = $t("content.support.borehole_inspection_service.tags.label_4");
    arr[4] = $t("content.support.borehole_inspection_service.tags.label_5");
  }
  return arr;
};
// 设置 表格 头部标题数据
const tableHeaderData = ref([])
const getTableHeaderData = (num: number) => {
    let arr:any[] = []
    if(num == 0) {
        
    }
    return arr
}


onMounted(() => {
  setPageData();
});
</script>
<style scoped lang="less"></style>
